<template>
  <div id="bigBox_1">
    <el-row>
      <el-col :span="24" class="foottext">
        <div>
          <div class="toptext"><span>本周签约概况</span></div>
          <div id="footext">
            <el-table :data="tableData" stripe style="width: 100%;
              box-shadow: 10px 10px 5px rgb(242, 245, 246); color: #333333;font-size: 13px;background-color: grey;">
              <el-table-column prop="name" label="团队"/>
              <el-table-column prop="Date_1" label="2022-09-14"/>
              <el-table-column prop="Date_2" label="2022-09-15"/>
              <el-table-column prop="Date_3" label="2022-09-16"/>
              <el-table-column prop="Date_4" label="2022-09-17"/>
              <el-table-column prop="Date_5" label="2022-09-18"/>
              <el-table-column prop="Date_6" label="2022-09-19"/>
              <el-table-column prop="Date_7" label="2022-09-20"/>
            </el-table>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script lang='ts'>
import {
  defineComponent,
} from "vue";
export default defineComponent({
  name: "Foottext",
  setup() {
    const tableData = [
  {
    name: '李明团队',
    Date_1: '50',
    Date_2: '100',
    Date_3:'120',
    Date_4:'146',
    Date_5:'160',
    Date_6:'180',
    Date_7:'150',
  },
  {
    name: '李明团队',
    Date_1: '50',
    Date_2: '100',
    Date_3:'120',
    Date_4:'146',
    Date_5:'160',
    Date_6:'180',
    Date_7:'150',
  },
  {
    name: '李明团队',
    Date_1: '50',
    Date_2: '100',
    Date_3:'120',
    Date_4:'146',
    Date_5:'160',
    Date_6:'180',
    Date_7:'150',
  },

]
 
    return {
      tableData
    };
  },
});
</script>
<style scoped lang='less'>
  #bigBox_1{
    padding-top:40px ;
    .toptext{
      padding-left: 30px;
    }
    .foottext {
  width: 100%;
  height: 400px;
  border-radius: 20px;
  box-shadow: 10px 10px 5px rgb(242, 245, 246);
}
#footext{
  padding: 10px 25px;
}
  }

</style>